<template>
  <a-tree
    v-model="checkedKeys"
    checkable
    :expanded-keys="expandedKeys"
    :auto-expand-parent="autoExpandParent"
    :selected-keys="selectedKeys"
    :tree-data="treeData"
    @expand="onExpand"
    @select="onSelect"
    @check="onCheck"
  />
</template>

<script>
import tenantid, { drctAlarmType } from '@/utils/tenantFilter';
import {getDictItemsFromCache} from '@/api/api'
export default {
  name: 'modelTree',
  data() {
    return {
      expandedKeys: [],
      autoExpandParent: true,
      checkedKeys: [],
      selectedKeys: [],
      alarmTypeOptions: getDictItemsFromCache(drctAlarmType), //告警类型-字典值
      treeData: [],
      // 反走私监测预警平台-规则
      treeData1: [
        {
          title: '轨迹类',
          key: 't1',
          checkable: false,
          disabled: true,
          children: [
            { title: '进入/离开关注海域', key: '0,1' },
            { title: '走私出/入岛行为', key: '14' },
            { title: '走私外省人员入岛', key: '6' },
            { title: '走私多人同一时间段出入境', key: '7,8' },
            { title: '走私聚集', key: '3' },
            { title: '疑似走私运输车联关联', key: '9' }
          ]
        },
        {
          title: '通联类',
          key: 't2',
          checkable: false,
          disabled: true,
          children: [
            { title: '走私异常出行', key: '10' },
            { title: '走私外地通联', key: '11' },
            { title: '走私异常活跃群体', key: '13' }
          ]
        },
        {
          title: '设备类',
          key: 't3',
          checkable: false,
          disabled: true,
          children: [
            { title: '一人多机', key: '12' },
            { title: '换机、换卡', key: '4' },
            { title: '走私人群集体关机', key: '2' }
          ]
        },
        {
          title: '上网类',
          key: 't4',
          checkable: false,
          disabled: true,
          children: [
            { title: '访问互联网', key: '5' },
          ]
        }
      ],
      // 重点人监测预警平台-规则
      treeData2: [
        {
          title: '轨迹类',
          key: 't1',
          checkable: false,
          disabled: true,
          children: [
            { title: '特定地区重点人员布控触网', key: '16' },
            { title: '消失告警', key: '15' },
            { title: '漫入告警', key: '0' },
            { title: '漫出告警', key: '1' },
            { title: '聚集伴随告警', key: '3' },
          ]
        },
        {
          title: '通联类',
          key: 't2',
          checkable: false,
          disabled: true,
          children: [
            { title: '异常通联告警', key: '13' }
          ]
        },
        {
          title: '设备类',
          key: 't3',
          checkable: false,
          disabled: true,
          children: [
            { title: '一人多机', key: '12' },
            { title: '换机、换卡', key: '4' },
            { title: '关机告警', key: '2' }
          ]
        },
        {
          title: '上网类',
          key: 't4',
          checkable: false,
          disabled: true,
          children: [
            { title: '访问互联网', key: '5' },
          ]
        }
      ],
    }
  },
  created() {
    if (tenantid===3) {
      this.treeData = this.treeData2
      this.onSelect(['16'], {});//默认选中第一个
    } else {
      this.treeData = this.treeData1
      this.onSelect(['0,1'], {});//默认选中第一个
    }
    // this.treeData = this.alarmTypeOptions.map((item)=>{
    //   return {
    //     title: item.title,
    //     key: item.value,
    //     checkable: true,
    //     children: []
    //   }
    // })
    for (let i = 0; i < this.treeData.length; i++) {
      let temp = this.treeData[i]
      this.setThisExpandedKeys(temp)
    }
    // this.onSelect(['0,1'], {});
    // this.checkedKeys = ['0,1', '2']
    // this.screen()
    // console.log(this.alarmTypeOptions)
  },
  // watch: {
  //   checkedKeys(checkedKeys) {
  //     console.log('onCheck', checkedKeys);
  //     this.$emit('checkedKeys', checkedKeys);
  //   },
  // },
  methods: {
    setThisExpandedKeys(node) {
      if (node.children && node.children.length > 0) {
        this.expandedKeys.push(node.key)
        for (let a = 0; a < node.children.length; a++) {
          this.setThisExpandedKeys(node.children[a])
        }
      }
    },
    onExpand(expandedKeys) {
      console.log('onExpand', expandedKeys);
      // if not set autoExpandParent to false, if children expanded, parent can not collapse.
      // or, you can remove all expanded children keys.
      this.expandedKeys = expandedKeys;
      this.autoExpandParent = false;
    },
    onCheck(checkedKeys, info) {
      console.log('onCheck', checkedKeys, info);
      this.checkedKeys = checkedKeys;
      let checkedNode = {
        checked: info.checked,
        ...info.node.dataRef
      }
      this.$emit('checkedKeys', checkedKeys, checkedNode);
    },
    onSelect(selectedKeys, info) {
      console.log('onSelect', selectedKeys, info);
      this.selectedKeys = selectedKeys;
      this.$emit('selectedKeys', selectedKeys);
    },
    screen() {
      const list = [
        {grade: '小学', city: '北京', count: 18},
        {grade: '小学', city: '上海', count: 12},
        {grade: '小学', city: '杭州', count: 19},
        {grade: '小学', city: '深圳', count: 10},
        {grade: '初中', city: '北京', count: 18},
        {grade: '初中', city: '上海', count: 12},
        {grade: '初中', city: '杭州', count: 19},
        {grade: '初中', city: '深圳', count: 10},
        {grade: '高中', city: '北京', count: 18},
        {grade: '高中', city: '上海', count: 12},
        {grade: '高中', city: '杭州', count: 19},
        {grade: '高中', city: '深圳', count: 10},
        {grade: '大学', city: '北京', count: 18},
        {grade: '大学', city: '上海', count: 12},
        {grade: '大学', city: '杭州', count: 19},
        {grade: '大学', city: '深圳', count: 10},
      ]
      console.log(this.convertOneDimArray(list, {nameKey: ['grade', 'city'],valueKey:'count'}))
    },
    /**
     * 将一维数组处理为二维数组
     * @param {Array} list 需要处理的一维数组
     * @param {Object} extra 包含 nameKey 和 valueKey
     * @param {Array} nameKey 长度为二的数组，依序为 name 取值
     * @param {String} valueKey value 取值的键
     * @returns 
     */
    convertOneDimArray(list, extra) {
      const { nameKey, valueKey } = extra || {};

      if (!nameKey || nameKey.length < 2 || !Array.isArray(list)) {
        return null;
      }

      const [name1, name2] = nameKey;
      const xMap = new Map();

      list.forEach((item) => {
        const x = item[name1];
        const y = {
          name: item[name2],
          value: item[valueKey],
        }
        const xValue = xMap.get(x);
        if (!xValue) {
          xMap.set(x, {
            name: x,
            value: [y],
          });
        } else {
          xValue.value.push(y)
        }
      });

      return [...xMap.values()];
    }
  }
}
</script>
<style lang="less" scoped>
/deep/li.ant-tree-treenode-disabled > .ant-tree-node-content-wrapper span {
color: rgba(0, 0, 0, 0.7);
}
</style>
